<template>
	<view class="container">
		<unicloud-db
			ref="udb"
			v-slot:default="{ data, loading, error, options }"
			:options="options"
			collection="orders"
			field="type,service_location,status,user_id,paramedic_id,level,arrangement,patient_name,patient_age,tel,hospital_id,ward,mark,total_price,score,tags,comment,start_date,end_date,arrange_day,arrange_hour,day_sum,hour_sum,start_hour,end_hour,pay_type,platform,create_time,update_time,paid_time,refund_time,refund_desc,transaction_id,updated_at"
			:where="queryWhere"
			:getone="true"
			:manual="true"
		>
			<view v-if="error">{{ error.message }}</view>
			<view v-else-if="loading"><uni-load-more :contentText="loadMore" status="loading"></uni-load-more></view>
			<view v-else-if="data" class="detail-rows">
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">ID，系统自动生成</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data._id }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">服务类型</div></el-col>
					<el-col :span="16">
						<!-- ， -->
						<div class="grid-content bg-purple-light">{{ data.type|typeFilter }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">服务类型</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.service_location|typeLocalFilter }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单状态</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.status|statusFilter }}</div>
					</el-col>
				</el-row>
				<!-- <el-row>
					<el-col :span="4"><div class="grid-content bg-purple"></div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.user_id }}</div>
					</el-col>
				</el-row> -->
				<!-- <el-row>
					<el-col :span="4"><div class="grid-content bg-purple">护工id，参考uni-id-users表</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.paramedic_id }}</div>
					</el-col>
				</el-row> -->
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单所属服务级别，级别高的护工可以选择接受低级别的订单</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.level }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单服务时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.arrangement }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">患者姓名</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.patient_name }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">患者年龄</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.patient_age }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">联系电话</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.tel }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单所在医院</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.hospital_id }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单所在详细地址信息</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.ward }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">病人大致情况备注</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.mark }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单总金额</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.total_price }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">用户评价分之</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.score }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">用户评价时选择的标签集合</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.tags }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">用户评价内容</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.comment }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">服务开始时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.start_date }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">服务结束时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.end_date }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">服务天数</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.arrange_day }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">服务小时</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.arrange_hour }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">天数总和</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.day_sum }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">小时总和</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.hour_sum }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">开始小时</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.start_hour }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">结束小时</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.end_hour }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">支付方式</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.pay_type|paytTypeMap }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">下单平台类型</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.platform|platformFilter }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单创建时间/发起退款时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.create_time }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单更新时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.update_time }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单付款时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.paid_time }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">订单完成退款时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.refund_time }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">退款原因</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.refund_desc }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">微信或支付宝交易单号</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.transaction_id }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">修改时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.updated_at }}</div>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="4"><div class="grid-content bg-purple">创建时间</div></el-col>
					<el-col :span="16">
						<div class="grid-content bg-purple-light">{{ data.created_at }}</div>
					</el-col>
				</el-row>
			</view>
		</unicloud-db>
		<view class="btns" v-show="false">
			<button type="primary" @click="handleUpdate">修改</button>
			<button type="warn" class="btn-delete" @click="handleDelete">删除</button>
		</view>
	</view>
</template>

<script>
// 由schema2code生成，包含校验规则和enum静态数据
import { enumConverter } from '../../js_sdk/validator/orders.js';
const typeMap = { 0: '到全天服务', 1: '时段服务' };
const typeLocalMap = { 0: '到医院服务', 1: '到家服务' };
const filtMap = {
	0: '已评论（订单结束）',
	1: '已付款（待服务）',
	2: '服务中',
	3: '服务结束',
	4: '已取消'
};
//，0:已评论（订单结束），1:已付款（待服务），2:服务中，3:服务结束，4:已取消
const paytTypeMap = {
	0: '微信支付',
	1: '支付宝支付'
};
const payPlatformMap = {
	0: 'h5',
	1: 'mp-weixin',
	2: 'mp-alipay',
	3: 'app-plus'
};
export default {
	filters: {
		typeFilter(type) {
			//0:到全天服务，1:时段服务
			return typeMap[type];
		},
		statusFilter(type) {
			return filtMap[type];
		},
		typeLocalFilter(type) {
			return typeLocalMap[type];
		},
		paytTypeFilter(type) {
			return paytTypeMap[type];
		},
		platformFilter(plat){
			return payPlatformMap[plat];
		}
	},
	data() {
		return {
			queryWhere: '',
			loadMore: {
				contentdown: '',
				contentrefresh: '',
				contentnomore: ''
			},
			options: {
				// 将scheme enum 属性静态数据中的value转成text
				...enumConverter
			}
		};
	},
	onLoad(e) {
		this._id = e.id;
	},
	onReady() {
		if (this._id) {
			this.queryWhere = '_id=="' + this._id + '"';
		}
	},
	methods: {
		handleUpdate() {
			// 打开修改页面
			uni.navigateTo({
				url: './edit?id=' + this._id,
				events: {
					// 监听修改页面成功修改数据后, 刷新当前页面数据
					refreshData: () => {
						this.$refs.udb.loadData({
							clear: true
						});
					}
				}
			});
		},
		handleDelete() {
			this.$refs.udb.remove(this._id, {
				success: res => {
					// 删除数据成功后跳转到list页面
					uni.navigateTo({
						url: './list'
					});
				}
			});
		}
	}
};
</script>

<style>
.container {
	padding: 10px;
}

.btns {
	margin-top: 10px;
	display: flex;
	flex-direction: row;
}

.btns button {
	flex: 1;
}

.btn-delete {
	margin-left: 10px;
}
</style>
